*{
    padding: 0;
    margin: 0;
}

html{
    height: 100%;
    font-size: 14px;

    body{
        height: 100%;
        color: #333;
        min-width: 1240px;
        font: 14px/1.4 Helvetica Neue, Helvetica, Arial, Microsoft Yahei, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif;
      }
}

ul{
    list-style: none;
    
}


/* i： 定义与文本中其余部分不同的部分，并把这部分文本呈现为斜体文本
    被用来表示科技术语、其他语种的成语俗语、想法、宇宙飞船的名字等等。
    在没有其他适当语义的元素可以使用时，请使用 <i> 元素。


    在 HTML 4.01 中，<i> 标签呈现斜体的文本。然而，在 HTML5 中没有必要这么做，可以使用样式表来格式化 <i> 元素中的文本。
*/
i { 
    font-style: normal;
}

.container {
    width: 1240px;
    margin: 0 auto;
    position: relative;
}

a{
    /* 去掉下划线 */
    text-decoration: none;

    color: #333;
}

/* 设置输入框样式 */
input[type='text'],
input[type='search'],
input[type='password'],
input[type='checkbox']{
    padding: 0;

    /* 聚焦时的轮廓线 */
    outline: none;

    /* 边框 */
    border: none;
    
    /* 去除浏览器的默认样式 */
    -webkit-appearance: none;
    appearance: none
}

/* 设置输入框，提示文字颜色 */
input[type='text']::placeholder,
input[type='search']::placeholder,
input[type='password']::placeholder,
input[type='checkbox']::placeholder{
    color: #ccc;
}


/* 动画 */

/* 进入起始状态，离开完成状态 */
.a-enter,.a-leave-to{
    opacity: 0;
}

/* 正在进入状态，正在离开状态 */
.a-enter-active,.a-leave-active{
    /* 透明度，0.5秒 */
    transition: opacity .5s;
}
/* 进入完成状态，离开起始状态 */
.a-enter-to,.a-leave{
    opacity: 1;
}


/* 进入起始状态，离开完成状态 */
.fade-enter,.fade-leave-to{
    opacity: 0;
}

/* 正在进入状态，正在离开状态 */
.fade-enter-active,.fade-leave-active{
    /* 透明度，0.5秒 */
    transition: opacity .5s;
}
/* 进入完成状态，离开起始状态 */
.fade-enter-to,.fade-leave{
    opacity: 1;
}
